<!DOCTYPE html>
<html>
    <head>
        <title>Bui 框架 富文本编辑器 SSM框架开发</title>
        <meta charset="UTF-8">
        <meta name="keywords" content="富文本编辑器、树形列表、树形控件、树控件、手风琴、拾色器、多文件上传、弹窗组件、模态窗口、双向联动表单、右键菜单、jquery拖动、draggable、datagrid、tree、mvvm、combox、tab" />
        <meta name="description" content="Bui editor ui框架是一套前后端分离，包含富文本编辑器、双向联动表单、树形列表、树形控件、模态窗口、手风琴、拾色器、多文件上传、弹窗组件等全功能UI框架。还包括Spring mvc spring mybatis高效开发框架" />
        <link rel="shortcut icon" href="/favicon.ico" />
        <link rel="bookmark" href="/favicon.ico" />
        <meta name="renderer" content="webkit|ie-stand" />
        <link type="text/css" rel="stylesheet" lang="stylesheet" href="../theme/default/base.css" />
        <link type="text/css" rel="stylesheet" lang="stylesheet" href="../theme/default/pagination.css" />
        <link type="text/css" rel="stylesheet" lang="stylesheet" href="../theme/font/bui-fonts.min.css" />        
        <script type="text/javascript" src="../javascript/basic-2.0.0.js"></script>
        <script type="text/javascript" src="../javascript/plugins-2.0.0.js"></script>
        <script type="text/javascript" src="../javascript/pagination-2.0.0.js"></script> 
        <script type="text/javascript" src="lang_config.js"></script>       
</head>

<body>
    <!-- <button onclick="testRm()">test</button> -->
    <div style="width: 100%;height: 100%;position: relative;">
        <div id="forRm" style="padding:50px 50px;">
            <div id="pg1"></div>
        </div>
        <div style="padding:50px 50px">
            <div id="pg2"></div>
        </div>
        <div style="padding:50px 50px">
            <div id="pg4"></div>
        </div>

        <div style="padding:50px 50px">
            <div id="pg3"></div>
        </div>
    </div>
   

    <script type="text/javascript">
  
        function testRm(){
           var el = document.getElementById("forRm");
           el.innerHTML = "<p>sssssss</p>";
        }


        function pageLoaded() {
            new $B.Pagination("#pg1",{
                total:1056,
                page:1,
                pageList: [15, 20, 25, 30, 35, 40, 55, 70, 80, 90, 100,'200'], //页大小项
                buttons:5,
                pageSize:10,
                summary:true,
                onClick:function(page,pageSize){
                    console.log("page = "+ page + " pageSize = "+pageSize);
                }
            });

            new $B.Pagination("#pg2",{
                total:566,
                page:1,
                buttons:10,
                pageSize:20,
                buttonCss:{
                    "background-color":"#E3EDF5",
                    "border-radius":"3px"
                },
                summary:true,
                onClick:function(page,pageSize){
                    console.log("page = "+ page + " pageSize = "+pageSize);
                }
            });

            new $B.Pagination("#pg3",{
                total:666,
                page:1,
                buttons:15,
                pageSize:10,
                simpleStyle:true,
                onClick:function(page,pageSize){
                    console.log("page = "+ page + " pageSize = "+pageSize);
                }
            });

            new $B.Pagination("#pg4",{
                total:888,
                page:1,
                buttons:20,
                pageSize:10,
                summary:false,
                buttonCss:{
                    "background-color":"#E8E8FA",
                    "border-radius":"3px"
                },
                onClick:function(page,pageSize){
                    console.log("page = "+ page + " pageSize = "+pageSize);
                }
            });

        };    
        $B.DomUtils.onDomLoaded(function () {
            pageLoaded();
        });
    </script>
</body>

</html>